// goodies.scss
// Mixins and functions good for any project

@mixin transition($property: all, $duration: '0.25s', $timing: ease, $delay: 0) {
  -o-transition: $property $duration $timing $delay;
  -moz-transition: $property $duration $timing $delay;
  -webkit-transition: $property $duration $timing $delay;
  transition: $property $duration $timing $delay;
}

@mixin rounded( $top: 4px, $right: 4px, $bottom: 4px, $left: 4px ) {
  -moz-border-radius: $top $right $bottom $left;
  -webkit-border-radius: $top $right $bottom $left;
  border-radius: $top $right $bottom $left;
}

@mixin box-shadow( $x: 0px, $y: 1px, $blur: 3px, $color: #000, $fade: 0.7, $inset: () ) {
  -moz-box-shadow: $inset $x $y $blur fade_out( $color, $fade );
  -webkit-box-shadow: $inset $x $y $blur fade_out( $color, $fade );
  box-shadow: $inset $x $y $blur fade_out( $color, $fade );
}

@mixin my-text-shadow( $x: 0px, $y: 1px, $blur: 3px, $color: #000, $fade: 0.7 ) {
  -moz-text-shadow: $x $y $blur fade_out( $color, $fade );
  -webkit-text-shadow: $x $y $blur fade_out( $color, $fade );
  text-shadow: $x $y $blur fade_out( $color, $fade );
}

@mixin gradientX( $color: #F5F5F5, $start: #EEE, $stop: #FFF) {
  background: $color;
  background: -webkit-gradient(linear,
              left bottom,
              right bottom,
              color-stop(0, $start),
              color-stop(1, $stop));
  background: -ms-linear-gradient(left,
              $start,
              $stop);
  background: -moz-linear-gradient(0deg,
              $start 0%,
              $stop
              100%);
}

@mixin gradientY($color: #F5F5F5, $start: #EEE, $stop: #FFF) {
  background: $color;
  background: -webkit-gradient(linear,
              left bottom,
              left top,
              color-stop(0, $start),
              color-stop(1, $stop));
  background: -ms-linear-gradient(bottom,
              $start,
              $stop);
  background: -moz-linear-gradient(center bottom,
              $start 0%,
              $stop
              100%);
}

@mixin capitalize {
  text-transform: uppercase; 
}

